<template>
	<view>
		<view class="display-a-js">
			<view class="color_FFFFFF">
				<view class="font-size_56rpx font-weight_bold margin-bottom_30rpx">您好 !</view>
				<view class="font-size_48rpx">欢迎登录~</view>
			</view>
			<image class="img-1" src="../../static/1.png"></image>
		</view>
		<view class="frame">
			<view class="top display-a">
				<view class="tabs" @click="tabs(1)">
					<view class="font-size_32rpx margin-bottom_10rpx" :class="currIndex == 1 ? 'color_4F29D2' : 'color_757575'">管理人</view>
					<view class="line" :class="currIndex == 1 ? 'back_4F29D2' : 'back_f7f7f7'"></view>
				</view>
				<view class="tabs" @click="tabs(2)">
					<view class="font-size_32rpx margin-bottom_10rpx" :class="currIndex == 2 ? 'color_4F29D2' : 'color_757575'">员工</view>
					<view class="line" :class="currIndex == 2 ? 'back_4F29D2' : 'back_f7f7f7'"></view>
				</view>
			</view>
			<view style="padding: 48rpx 36rpx;">
				<view class="display-a margin-bottom_20rpx">
					<image class="img-2" src="../../static/2.png"></image>
					<view class="font-size_30rpx">账号</view>
				</view>
				<input type="text" class="p-bo input-box" maxlength="11" v-model="staffCode" placeholder="请输入登录账号" placeholder-class="placeholder" />
				<view class="display-a margin-bottom_20rpx" style="margin-top: 48rpx;">
					<image class="img-2" src="../../static/3.png"></image>
					<view class="font-size_30rpx">密码</view>
				</view>
				<input type="safe-password" class="p-bo input-box" v-model="password" password placeholder="请输入登录密码" placeholder-class="placeholder" />
			</view>
			<view class="but" @click="login()">立即登录</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			currIndex: 1, //1管理员 2员工
			staffCode: '',
			password: '',

			//1矩阵发布  2数字人剪辑  3现场大屏
			//4视频剪辑  5云闪推  6抖支付
			//7同城爆店码  8更新通知  9数据中心页
			type: 0,
			id: '' //首页详情ID
		};
	},

	onLoad(options) {
		if (options.type) {
			this.type = options.type;
		}
		if (options.id) {
			this.id = options.id;
		}
		this.staffCode = uni.getStorageSync('staffCode');
		this.currIndex = uni.getStorageSync('types') ? uni.getStorageSync('types') : 1;
	},

	onShow() {},

	methods: {
		async login() {
			if (!this.staffCode) {
				this.$sun.toast('请输入登录账号', 'none');
				return;
			}

			if (!this.password) {
				this.$sun.toast('请输入登录密码', 'none');
				return;
			}

			const result = await this.$http.post({
				url: this.$api.staffLogin,
				data: {
					staffCode: this.staffCode,
					password: this.password,
					types: this.currIndex
				}
			});

			if (result.code == 2000) {
				this.$sun.toast('登录成功');
				setTimeout(() => {
					uni.setStorageSync('types', this.currIndex);
					uni.setStorageSync('staffCode', this.staffCode);
					if (this.currIndex == 1) {
						uni.setStorageSync('merchantId', result.data.id);
						if (this.type > 0 && this.type < 7 && this.type != 6) {
							uni.redirectTo({
								url: '/pages/index/detail?type=' + this.type + '&id=' + this.id
							});
						}
						if (this.type == 7 || this.type == 0) {
							uni.navigateTo({
								url: '/pages/index/index'
							});
						}
						if (this.type == 6) {
							uni.redirectTo({
								url: '/pages/doPay/doPay'
							});
						}

						if (this.type == 9) {
							uni.redirectTo({
								url: '/pages/merchantConfiguration/merchantConfiguration'
							});
						}
						if (this.type == 8) {
							uni.redirectTo({
								url: '/pages/index/log'
							});
						}
						// 修改云闪推跳转
						if (this.type == 5) {
							uni.redirectTo({
								url: '/pages/cloudFlashPush/homePage/homePage'
							});
						}
						// if (this.type == 9) {

						// 	uni.switchTab({
						// 		url: '/pages/index/center'
						// 	})
						// }
					}
					if (this.currIndex == 2) {
						uni.setStorageSync('staffId', result.data.id);
						uni.setStorageSync('merchantId', result.data.merchantId);
						uni.navigateTo({
							url: '/pages/index/writeOffPage'
						});
					}
				}, 2000);
			} else {
				this.$sun.toast(result.msg, 'none');
			}
		},

		tabs(index) {
			this.currIndex = index;
		}
	}
};
</script>

<style lang="scss">
.but {
	width: 530rpx;
	background: linear-gradient(180deg, #6568f6 18.23%, #1e6ceb 100%);
	box-shadow: 0px 4px 4px rgba(78, 41, 210, 0.5);
	border-radius: 100rpx;
	font-size: 32rpx;
	color: #ffffff;
	text-align: center;
	padding: 20rpx;
	margin-top: 64rpx;
	margin-left: 58rpx;
}

.input-box {
	width: 564rpx;
	padding: 20rpx 0;
}

.img-2 {
	width: 36rpx;
	height: 36rpx;
	margin-right: 10rpx;
}

.back_4F29D2 {
	background-color: #4f29d2;
}

.back_f7f7f7 {
	background-color: #f7f7f7;
}

.line {
	width: 44rpx;
	height: 6rpx;
	border-radius: 100rpx;
	margin-left: 140rpx;
}

.tabs {
	width: 322rpx;
	text-align: center;
}

.top {
	background-color: #f5f5f5;
	border-radius: 10rpx 10rpx 0 0;
	padding: 30rpx 0 12rpx;
}

.frame {
	width: 646rpx;
	height: 726rpx;
	border-radius: 10rpx;
	background-color: #ffffff;
	margin-top: 44rpx;
}

.img-1 {
	width: 292rpx;
	height: 216rpx;
}

page {
	background-color: #6568f6;
	padding: 60rpx 52rpx 0;
}
</style>
